<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Webflux测试</title>
</head>
<body>
<button onclick="sendHttpAction()">点击发起http请求</button>
<button onclick="sendStreamAction()">点击发起webflux请求</button>
<script type="text/javascript">

    /**
     * 发起http请求
     */
    function sendHttpAction() {
        // 指定相应内容为 text/plain
        fetch('/api/http/demo/hello', {
            headers: {
                'Content-Type': 'text/plain'
            }
        }).then(response => response.text())
            .then(data => console.log(data))
            .catch(error => console.error(error));
    }

    /**
     * 发起webflux请求
     */
    function sendStreamAction() {
        const eventSource = new EventSource('/api/stream/demo/hello');
        eventSource.onopen = (event) => {
            // 连接已建立
            console.log('Connection opened!');
        };
        eventSource.onerror = (event) => {
            // 连接错误
            console.error('Error occurred:', event);
        };
        eventSource.onmessage = (event) => {
            // 接收到消息
            const data = JSON.parse(event.data);
            console.log('Received data:', data);
            // 没有内容响应式关闭接口
            if (data.body === null) {
                eventSource.close()
            }
        };
        eventSource.onclose = (event) => {
            // 连接已关闭
            console.log('Connection closed!');
        };
    }

</script>
</body>
</html>
